<template>
  <Dialog v-model="showDeleteDialog" width="480" title="Dispose Details">
    <template #headerAppend="{ close }">
      <v-icon color="#fff" @click="close">mdi-close</v-icon>
    </template>
    <template>
      <v-card flat class="dispose-details">
        <v-row no-gutters class="input-box">
          <v-col cols="4" class="label">Description</v-col>
          <v-col cols="6">
            <v-text-field
              solo
              hide-details
              dense
              class="white-input"
              label="please enter the description"
            ></v-text-field>
          </v-col>
        </v-row>
        <v-btn fab class="elevation-0 add-btn">
          <v-icon color="#626C84" size="20">mdi-plus-thick</v-icon>
        </v-btn>
      </v-card>
    </template>
  </Dialog>
</template>

<script lang="ts">
import { Vue, Component, PropSync } from "vue-property-decorator";
import Dialog from "@/components/Maintenance/Dialog/Dialog.vue";
@Component({
  components: {
    Dialog,
  },
})
export default class DisposeDetails extends Vue {
  @PropSync("show", {
    type: Boolean,
    default: false,
  })
  showDeleteDialog!: boolean;
}
</script>

<style lang="scss" scoped>
@import "./DisposeDetails.scss";
</style>
